{extend name="layout/base"}
{block name="css"}
<style media="screen">
.pagination>.active>a, .pagination>.active>a:focus, .pagination>.active>a:hover, .pagination>.active>span, .pagination>.active>span:focus, .pagination>.active>span:hover {
    background-color: #414141;
    border-color: #414141;
}
.pagination>li>a, .pagination>li>span {
    color: #414141;
}
.pagination>li {
    display: inline-block;
    float: left;
}
</style>
{/block}

{block name="content"}
<!--Banner-->
<div class="banner" id="index-banner">
    <div class="banner-pics">
        <ul class="banner-pics-list OnSale-banner">
            {volist name="$info.banner" id="v"}
            <li><img src="{$v}" alt=""/></li>
            {/volist}
        </ul>
    </div>
    <ul class="banner-tit">
        {volist name="$info.banner" id="v" key="k"}
        <li {if condition="$k eq 1"}class="on"{/if}></li>
        {/volist}
    </ul>
</div>

<div class="business-tab">
    <ul>
        <li class="active">基本信息</li>
        <li>浏览量{$history_num}</li>
        <li>拨打量{$call_num}</li>
    </ul>
</div>

<div class="business-content mb20">
    <div class="content-item active">
        <div class="company-info">
            <div class="btn-box">
                <div class="btn-group">
                    <button type="button" class="btn btn-default btn-active">基本信息</button>
                    <button type="button" class="btn btn-default">认证信息</button>
                </div>
            </div>
            <h2>{$info.name}</h2>
            <div class="sub-content-box">
                <div class="container active">
                    <p style="padding: .2rem 0;"><i class="linkman"></i> <span>联系人：</span> <span>{$info.link_man}</span> </p>
                    <p style="padding: .2rem 0;"><i class="telephone"></i> <span>手&nbsp;&nbsp;&nbsp;机：</span> <span> <a href="tel:{$info.phone}" class="comfirm">{$info.phone}</a> </span> </p>
                    <p style="padding: .2rem 0;"><i class="phone"></i> <span>座&nbsp;&nbsp;&nbsp;机：</span> <span> <a href="tel:{$info.telephone}" class="comfirm">{$info.telephone}</a> </span> </p>
                    <p style="padding: .2rem 0;"><i class="qq"></i> <span>Q&nbsp;&nbsp;&nbsp;Q：</span> <span>{$info.qq}</span> </p>
                    <p style="padding: .2rem 0;"><i class="map"></i> <span>地&nbsp;&nbsp;&nbsp;址：</span> <span> <a href="https://apis.map.qq.com/uri/v1/geocoder?coord={$info.lat},{$info.lng}&referer=OB4BZ-D4W3U-B7VVO-4PJWW-6TKDJ-WPB77">{$info.address}</a> </span> </p>
                    {if condition="$info['website']"}<p><i class="link"></i> <span>公司网站：</span>{/if} <span><a href="{$info.website}">{$info.website}</a></span> </p>
                    {if condition="$info['qrcode']"}
                    <div class="qrcode">
                        <img src="{$info.qrcode}" alt="">
                        <p>长按识别二维码</p>
                    </div>
                    {/if}
                    <div id="business-product" style="background: #f5f5f5; padding-top: .3rem;">
                        {php}
                        use think\Request;
                        $request = Request::instance();
                        $domain = $request->domain();
                        {/php}
                        {volist name="product" id="v"}
                        <div class="company-item">
                            <img src="{$domain}{$v.cover}" alt="" style="width:6rem;">
                            <span style="left: 7rem;">{$v.name}</span>
                            <div class="product-info" style="left: 7rem;">
                                <p style="line-height:.6rem;padding-bottom: 0">型号/规格：{$v.version}</p>
                                <p style="line-height:.6rem;padding-bottom: 0">价格：{if condition="$v.price == 0"}面议{else/}{$v.price}{/if}</p>
                                <p style="line-height:.6rem;padding-bottom: 0">起购：{$v.day_buy}</p>
                            </div>
                        </div>
                        {/volist}
                        <div class="clear"></div>
                        <div class="page center">
                            {$page}
                        </div>
                    </div>
                </div>
                <div class="container auth-box">
                    <div class="form-group">
                        <label class="col-sm-2 control-label"><i class="auth"></i> <span>认&nbsp;证&nbsp;商&nbsp;家</span></label>
                        <div class="col-sm-10">
                            <span class="red">{if condition="$auth"}已{else/}未{/if}认证</span>
                        </div>
                    </div>
                    <div class="form-group">
                        <label class="col-sm-2 control-label"><i class="auth_time"></i> <span>认&nbsp;证&nbsp;时&nbsp;间</span></label>
                        <div class="col-sm-10">
                            <span>{if condition="$auth"}{$auth.auth_time|date='Y-m-d', ###}{else/}无{/if}</span>
                        </div>
                    </div>
                    <div class="form-group">
                        <label class="col-sm-2 control-label"><i class="baozheng"></i> <span>售后保证金</span></label>
                        <div class="col-sm-10">
                            <span>{if condition="$auth"}{$auth.baozhengjin}{else/}无{/if}</span>
                        </div>
                    </div>
                    <div class="form-group">
                        <label class="col-sm-2 control-label align-top"><i class="zhizhao"></i> <span>营&nbsp;业&nbsp;执&nbsp;照</span></label>
                        <div class="col-sm-10">
                            {if condition="$auth"}<img src="{$auth.zhizhao}" alt="">{else/}<span>无</span>{/if}
                        </div>
                    </div>
                    <div class="form-group">
                        <label class="col-sm-2 control-label align-top"><i class="fanwei"></i> <span>经&nbsp;营&nbsp;范&nbsp;围</span></label>
                        <div class="col-sm-10">
                            <span>{if condition="$auth"}{$auth.fanwei}{else/}无{/if}</span>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <div class="content-item">
        <div class="container">
            <p class="icon">
                <img class="fl" src="__CDN__/assets/img/wechat_03.png" alt="">
                <img class="fr" src="__CDN__/assets/img/time_03.png" alt="">
                <div class="clearfix"></div>
            </p>
            {volist name="history" id="v"}
            <p class="clearfix">
                <span class="fl"><img src="{$v.avatar}" alt="">{$v.nickname}</span>
                <span class="fr">{$v.time|date='Y-m-d H:i:s',###}</span>
            </p>
            {/volist}
        </div>
    </div>
    <div class="content-item">
        <div class="container">
            <p class="icon">
                <img class="fl" src="__CDN__/assets/img/wechat_03.png" alt="">
                <img class="fr" src="__CDN__/assets/img/time_03.png" alt="">
                <div class="clearfix"></div>
            </p>
            {volist name="call" id="v"}
            <p class="clearfix">
                <span class="fl">{$v.nickname}</span>
                <span class="fr">{$v.create_time|date='Y-m-d', ###}</span>
            </p>
            {/volist}
        </div>
    </div>
</div>


<div class="bind-mobile-box">
    <div class="box1">
        <form class="bindmobile" action="{:url('user/bindmobile')}">
            <h2>绑定手机号</h2>
            <div class="form-box">
                <div class="form-group">
                    <input type="text" name="mobile" id="mobile" class="form-control" placeholder="请输入手机号">
                </div>
                <div class="form-group">
                    <input type="text" name="code" class="form-control codeinput" placeholder="请输入验证码">
                    <button type="button" class="getcode" id="getcode">获取验证码</button>
                </div>
            </div>
            <button type="submit" class="btn btn-default lg btn-block btn-submit ajax-post" target-form="bindmobile">提交</button>
        </form>
    </div>
</div>

{/block}

{block name="footer"}
{include file="common/footer" /}
{/block}

{block name="script"}
<script src="__CDN__/assets/js/TouchSlide.1.1.js"></script>
<!-- <script type="text/javascript" src="http://res.wx.qq.com/open/js/jweixin-1.0.0.js"></script> -->
<script src="http://res.wx.qq.com/open/js/jweixin-1.2.0.js" type="text/javascript" charset="utf-8"></script>


<script type="text/javascript">
TouchSlide({
    slideCell:"#index-banner",
    titCell:".banner-tit li",//开启自动分页 autoPage:true ，此时设置 titCell 为导航元素包裹层
    mainCell:".banner-pics-list",
    effect:"left",
    autoPlay:true,//自动播放
})

$(function() {
    var mobile = "{$mobile}";
    $('.btn-default').click(function() {
        $(this).addClass('btn-active').siblings().removeClass('btn-active');
        $('.sub-content-box .container').eq($(this).index()).addClass('active').siblings().removeClass('active');
    })
    $('.business-tab li').click(function() {
        $(this).addClass('active').siblings().removeClass('active');
        $('.business-content .content-item').eq($(this).index()).addClass('active').siblings().removeClass('active');
    });


    $('.comfirm').click(function() {
        if(mobile == '') {
            $('.bind-mobile-box').show();
            return false;
        }else{
            $.ajax({
                url: "{:url('business/call', ['business_id' => $info['id'], 'mobile' => $mobile])}",
                type: 'GET',
                success: function(res) {

                }
            })
            return true;
        }
    });


    var countdown=60;

    function settime(obj) {
        if (countdown == 0) {
            obj.attr("disabled", false).removeClass('disabled');
            obj.html("获取验证码");
            countdown = 60;
            return;
        } else {
            obj.attr("disabled", true).addClass('disabled');
            obj.html("重新发送(" + countdown + ")");
            countdown--;
        }
        setTimeout(function() {
            settime(obj)
        },1000)
    }
    $('.bind-mobile-box').click(function() {
        $('.bind-mobile-box').hide();
        $('input[name=mobile]').val('');
        $('.ajax-post').attr('disabled', false).removeClass('disabled');
    })
    $(".box1").click(function() {
        event.stopPropagation();
    });

    $('#getcode').click(function() {
        var _this = $(this);
        $.ajax({
            url: "{:url('ajax/sendcode')}",
            type: 'GET',
            data: {mobile: $('#mobile').val(), 'event': 'bindmobile'},
            success: function(res) {
                if(res.code) {
                    settime(_this);
                }
                layui.use(['layer'], function(){
                    var layer = layui.layer;
                    layer.msg(res.msg);
                });
            }
        })
    })

    // 点击预览图片
	$('.business-content .company-item').on('click','img',function(){
		var src = $(this).attr('src');
		var imgs = $(this).parent().parent().find('img');
		var list = new Array();
		for (var i = 0; i < imgs.length; i++) {
			list.push($(imgs[i]).attr('src'));
		}
		wx.previewImage({
		    current: src, // 当前显示图片的http链接
		    urls: list // 需要预览的图片http链接列表
		});
	});

    wx.config({$js->config(array('onMenuShareTimeline', 'onMenuShareAppMessage'), false)});
    wx.ready(function () {      //需在用户可能点击分享按钮前就先调用
        wx.onMenuShareTimeline({
            title: '', // 分享标题
            link: '', // 分享链接，该链接域名或路径必须与当前页面对应的公众号JS安全域名一致
            imgUrl: 'http://shang.cloudtimes.top/assets/img/logo.jpeg', // 分享图标
            success: function () {
              // 设置成功
            }
        });
        wx.onMenuShareAppMessage({
            title: '', // 分享标题
            link: '', // 分享链接，该链接域名或路径必须与当前页面对应的公众号JS安全域名一致
            desc: '商情瞭望', // 分享描述
            imgUrl: 'http://shang.cloudtimes.top/assets/img/logo.jpeg', // 分享图标
            success: function () {
              // 设置成功
            }
        });
    });
})
</script>
{/block}
